<template>
    <div class="table">
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item><i class="el-icon-menu"></i> 科室管理</el-breadcrumb-item>
                <el-breadcrumb-item>添加</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="info">
			<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
        	<table style="width:100%">
        		<tr style="width:100%">
        			<td colspan=2 class="title">所属科室添加</td>
        		</tr>
        		<tr style="width:100%">
     					<td class="field">所属科室名称:</td>
        			<td >
						<el-form-item prop="name"><el-input placeholder="请输入科室名称" style="width:300px" v-model="ruleForm.name"></el-input></el-form-item>
        			</td>
        		</tr>		 
        		<tr>
        			<td colspan=2 style="height:80px">
        				 <el-button type="success" style="margin-left:1%;width:220px;" @click="submitForm('ruleForm')">提交科室信息</el-button>
        			</td>
        		</tr>	
        	</table>
        </el-form>
        </div>
    </div>
</template>

<script>
import area from "../Public/area.vue";
export default {
  data () { 

    return {
        rules:{
            name: [
                { required: true, message: '请输入科室名称', trigger: 'blur' }
            ]
       	},
       	ruleForm:{
	    	name:''
	   	}
    }
  },
  created: function () {

  },
  mounted:function(){
  	$('.el-form-item__content').css('margin-left','0px');
  	$('.el-form-item__content').css('margin-top','10px');
  	$('.el-form-item').css('height','50px');
  },
  components: {
    'myarea':area
  },
  watch:{

  },
  methods: {
    submitForm(flag){
		this.$http.post("http://www.yuyue.com/api/deportment",
		  {
		  	name:this.ruleForm.name
		  },
		  {emulateJSON:true}
		).then(response=>{
			var data = response.data;
			if(data.code == 200 ){

			}else{
				this.throw_notice('病人信息提交失败,检查是否提交有误');
			}
		},error=>{
			this.throw_notice('病人信息提交失败,检查是否提交有误');
		})
    }
  }
}
</script>

<style scoped>
.info{
	width: 100%;
}
.title{
	height: 60px;
	font:bold 30px/58px '微软雅黑';
	text-align: center;
	color:#666;
}
.field{
	width:12%;
	height: 55px;
	font:22px/54px '仿宋';
	text-align: center;
}

</style>
